<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" type="text/css" href="../../css/style.css" />
		<style type="text/css">
			html,boby { background:#fff; }
			.identit{ background: linear-gradient(to left, #8AB6E6, #3C70BD); position: relative; padding: 24px 15px 0; height: 130px;}
			.identit .m_cell_hd img{ width: 34px; margin-right: 10px;}
			.identit .m_cell_hd h4{ display:block; font-size: 15px; font-weight: 400; color: #fff;}
			.identit .m_cell_ft a{ display:block; font-size: 13px; color: #fff; border: 0.8px #fff solid; border-radius: 4px; padding: 0 10px; height: 25px; line-height: 25px;}
			.identit .info{ position:absolute; left: 15px; right: 15px; bottom: -35px; padding: 5px 15px 10px; background-color: #fff; border-radius: 4px; box-shadow: 0 0 10px rgba(0,0,0,0.07); min-height: 100px;}
			.identit .info b{ display:block; font-size: 12px; color: #333; line-height: 35px; font-weight: 500;}
			.identit .info img{ float: left; width: 60px; height: 60px; border-radius: 4px; margin-right: 12px;}
			.identit .info div{ overflow: hidden; padding-top: 6px; font-size: 18px; color: #333; font-weight:500; line-height: 26px; }
			.identit_info{ padding: 50px 15px 42px; background-color: #fff;}
			.identit_info b{ display:block; font-size: 14px; color: #403D3D; font-weight: 400; line-height: 55px;}
			.identit_info li{ float: left; width: 48.5%; overflow: hidden; margin-bottom: 10px;}
			.identit_info li:nth-child(2n){ float: right;}
			.identit_info img{ width: 100%; border-radius: 4px; height:106px; object-fit: cover;}
			.identit_info .loadimg { width:16px; height:16px; margin:45px auto; vertical-align: middle;}
		</style>
	</head>
	<body>
		<div id="result">
		
		</div>
		<script id="myauth_template" type="text/template">
		<div class="identit">
			<div class="m_cell_hd"><img src="../../image/authstatus{{=it.status}}.png" alt="" /></div>
			{{? it.status == 0}}
			<div class="m_cell_hd m_cell_primary"><h4>身份认证审核中</h4></div>
			{{?? it.status == 1}}
			<div class="m_cell_hd m_cell_primary"><h4>身份认证已通过</h4></div>
			{{?? it.status == 2}}
			<div class="m_cell_hd m_cell_primary"><h4>身份认证未通过</h4></div>
			<div class="m_cell_ft"><a href="javascript:;" tapmode onclick="showreason();">了解详情</a></div>
			{{?}}
			<div class="info">
				<b>个人信息</b>
				<ul class="clearfix">
				  <img data-url="{{=it.avatar}}" onload="fnLoadImage(this);" src="../../image/defaultimg.png" id="avatar" />
				  <div>
						<p id="realname">{{=it.realname}}</p>
						<p id="idcard">{{=it.idcard}}</p>
					</div>
				</ul>
			</div>
		</div>

		<div class="identit_info">
			<b>证件信息</b>
		  <ul class="clearfix">
				<li><img data-url="{{=it.cardIDthumb1}}" onload="fnLoadImage(this);" class="loadimg" tapmode onclick="fnOpen(0);" src="../../image/load.gif" /></li>
				<li><img data-url="{{=it.cardIDthumb2}}" onload="fnLoadImage(this);" class="loadimg" tapmode onclick="fnOpen(1);" src="../../image/load.gif" /></li>
				<li><img data-url="{{=it.cardIDthumb3}}" onload="fnLoadImage(this);" class="loadimg" tapmode onclick="fnOpen(2);" src="../../image/load.gif" /></li>
				{{? it.cardIDthumb4!= ''}}
				<li><img data-url="{{=it.cardIDthumb4}}" onload="fnLoadImage(this);" class="loadimg" tapmode onclick="fnOpen(3);" src="../../image/load.gif" /></li>
				{{?}}
			</ul>
		</div>
		<!--身份审核end-->

		{{? it.status == 2}}
		<div class="s_fix">
			<button class="d_btn" tapmode="btnpress" onclick="regagain();">重新认证</button>
		</div>
		{{?}}
		</script>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/app.js"></script>
	<script type="text/javascript" src="../../script/doT.js"></script>
	<script type="text/javascript">
		var imgs = [];
		var reason = '';
		var photoBrowser;
		var openimged = 0;
		var UILoading;
		apiready = function() {
			api.parseTapmode();
			UILoading = api.require('UILoading');
			photoBrowser = api.require('photoBrowser');
			$api.css($api.byId('result'), 'display: none');
			showloading();
			getJsonFromAPI();
			api.addEventListener({
				name : 'keyback'
			}, function(ret, err) {
				if(openimged == 1) {
					openimged = 0;
					photoBrowser.close();
				}
				else
				{
					api.closeWin({
					});
				}
			});
			api.addEventListener({
                name: 'navitembtn'
            }, function(ret, err) {
                if (ret.type == 'left') {
					api.closeWin({
					});
                }
            });
			api.addEventListener({
				name : 'reloadpage'
			}, function(ret, err) {
				getJsonFromAPI();				
			});
		}
		function regagain() {
			api.getPrefs({
				key: 'user_info'
			}, function(ret, err) {
				if (ret.value) {
					var userinfo = JSON.parse(ret.value);
					var usertype = userinfo.usertype;
					var param = {
						mobile: userinfo.mobile,
						password: '123456',
						regtype: 3
					};
					var pagename = 'reggoodsuser';
					var pagetitle = '车主认证';
					if(usertype == 2)
					{
						pagename = 'regcompanyuser';
						pagetitle = '企业认证';
					}
					openNavWin('#ddd',pagename+'_win','../login/'+pagename+'_frm.html',pagetitle,false,false,true,[],param);
				}
			});
			
		}
		function showreason() {
			apialert(reason);
		}
		function fnLoadImage(obj) {
			obj.onload = null;
			var dataUrl = $api.attr(obj, 'data-url');
			if(dataUrl!=''){
				api.imageCache({
					url: dataUrl,
					thumbnail: false
				}, function(ret, err) {
					if(ret && ret.status == true){
						obj.src = ret.url;
						setTimeout(function(){
							$api.removeCls(obj,'loadimg');
						}, 100);
					}
				});
			}
		}
		function fnOpen(index) {
			console.log(JSON.stringify(imgs));
			openimged = 1;
			photoBrowser.open({
					images: imgs,
					activeIndex: index,
					//placeholderImg: 'widget://image/apicloud.png',
					bgColor: '#000'
			}, function(ret) {
				if (ret.eventType == 'click') {
					photoBrowser.close();
					openimged = 0;
				}
			});
        }
		function getJsonFromAPI() {
			//从接口获取查询数据
			api.getPrefs({
				key: 'user_info'
			}, function(ret, err) {
				if (ret.value) {
					var userinfo = JSON.parse(ret.value);
					api.ajax({
						url: ApiUrl + '/v1/userinfo',
						method: 'get',
						cache: false,
						timeout: 10,
						headers: {
							authorization: kAppKey+';'+userinfo.access_token+';'+userinfo.uid
						}
					}, function(ret, err) {
						hideloading();
						$api.css($api.byId('result'), 'display: block');
						if (ret) {
							userinfo.status = ret.status;
							api.setPrefs({
								key: 'user_info',
								value: userinfo
							}, function(ret, err) {
								if(ret)
								{
									api.sendEvent({
										name : 'updateuser',
										extra : {
											userjson : userinfo
										}
									});
								}
							});
							ret.avatar = userinfo.avatar;
							reason = ret.reason;
							imgs.push(ret.cardIDthumb1);
							imgs.push(ret.cardIDthumb2);
							imgs.push(ret.cardIDthumb3);
							imgs.push(ret.cardIDthumb4);
							UpdateList('result','myauth_template',ret,false);
						} else {
							if(err.statusCode==402)
							{
								Relogin();
							}
							else
							{
								toast('网络异常');
								console.log(JSON.stringify(err));
							}
						}
					});
				}
			});
		}
		//渲染数据
		function UpdateList(domId,templateId,jsondata,isAppend) {
			//console.log(JSON.stringify(jsondata));
			var act_content = $api.byId(domId);
			var tempFn = doT.template($api.byId(templateId).innerHTML);
			var resultText = tempFn(jsondata);
			//alert(isAppend);
			console.log(resultText);
			if(isAppend)
			{
				$api.append(act_content, resultText);
			}
			else
			{
				$api.html(act_content, resultText);
			}
			api.parseTapmode();
		}
	</script>
</html>